<template>
  <view class="device-container">
    <!-- 顶部搜索区域 -->
    <view class="search-area">
      <view class="search-form">
        <view class="search-inputs">
          <view class="search-input">
            <u-input v-model="searchForm.deviceId" placeholder="设备ID" border="surround"></u-input>
          </view>
          <view class="search-input">
            <u-input v-model="searchForm.roomName" placeholder="房间名称" border="surround"></u-input>
          </view>
        </view>
        <view class="search-buttons">
          <u-button type="primary" size="mini" @click="handleSearch">搜索</u-button>
          <u-button type="warning" size="mini" @click="resetSearch">重置</u-button>
        </view>
      </view>
    </view>

    <!-- 设备列表 -->
    <view class="device-list">
      <view class="device-card" v-for="(device, index) in deviceList" :key="index">
        <view class="device-info">
          <view class="device-header">
            <text class="device-id">设备ID：{{ device.deviceId }}</text>
            <text class="device-status" :class="device.bound ? 'status-bound' : 'status-unbound'">
              {{ device.bound ? '已绑定' : '未绑定' }}
            </text>
          </view>
          <view class="device-detail">
            <view>房间：{{ device.roomName || '未绑定' }}</view>
            <view>门店：{{ device.storeName }}</view>
            <view>设备类型：{{ device.type }}</view>
            <view>MAC地址：{{ device.macAddress }}</view>
          </view>
        </view>
        <view class="device-actions">
          <u-button 
            :type="device.bound ? 'error' : 'primary'" 
            size="mini" 
            @click="handleDeviceBind(device)"
          >
            {{ device.bound ? '解绑' : '绑定' }}
          </u-button>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      searchForm: {
        deviceId: '',
        roomName: ''
      },
      deviceList: [
        {
          deviceId: '103b6b4d',
          roomName: 'V666房间',
          storeName: '咸宁-天洁店',
          type: '门锁',
          macAddress: '00:1B:44:11:3A:B7',
          bound: true
        },
        {
          deviceId: '103b6b4e',
          roomName: '',
          storeName: '咸宁-天洁店',
          type: '门锁',
          macAddress: '00:1B:44:11:3A:B8',
          bound: false
        }
      ]
    }
  },
  methods: {
    handleSearch() {
      // 实现搜索逻辑
      console.log('搜索', this.searchForm)
    },
    
    resetSearch() {
      this.searchForm.
</script>
